<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <title>$Title$</title>
    <style>
        .odd-row {
            background-color: aqua; /* 奇数行的背景颜色 */
        }
        .even-row {
            background-color: #ffffff; /* 偶数行的背景颜色 */
        }
    </style>
</head>
<body>
<h2 style="text-align: center;">园区门禁管理系统</h2>
<form action="<%=request.getContextPath()%>/index" method="get">
    <input type="hidden" name="op" value="index">
    <div style="text-align: center;margin:0 auto;">
        <select name="buidingId">
            <option value="0">---请选择---</option>
            <c:forEach items="${bList}" var="l">
                <option
                        <c:if test="${hospitalId==l.id}">selected</c:if> value="${l.id}">${l.name}</option>
            </c:forEach>
        </select>
        <input type="submit" value="查询">
        <a href="<%=request.getContextPath()%>/add"><input type="button" value="添加"></a>
        <table style="text-align:center;margin: auto; width:700px;">
            <tr style="background-color: dimgrey;">
                <td>负责人</td>
                <td>供货商</td>
                <td>品牌</td>
                <td>所属楼宇</td>
                <td>安装时间</td>
                <td>运行状态</td>
                <td>操作</td>
            </tr>
            <c:forEach items="${page.data}" var="b" varStatus="status">
                <tr class="${status.index % 2 == 0 ?'even-row' : 'odd-row'}">
                    <td>${b.principal}</td>
                    <td>${b.supplier}</td>
                    <td>${b.brand}</td>
                    <td>${b.name}</td>
                    <td><fmt:formatDate value="${b.add_time}" pattern="yyyy-MM-dd"/></td>
                    <td>${b.status==1?"启用":"停用"}</td>
                    <td>
                        <c:if test="${b.status==1}">
                            <a href="javascript:;" bid="${b.id}" id="sta">停用</a>
                        </c:if>
                        <c:if test="${b.status==0}">
                            <a href="javascript:;" bid="${b.id}" id="sta">启用</a>
                        </c:if>
                    </td>
                </tr>
            </c:forEach>
        </table>
        <div style="text-align: center;">
            <span>第${page.pageIndex}页/共${page.pageCount}页</span>
        </div>
        <c:if test="${page.hasPrevious}">
            <a href="<%=request.getContextPath()%>/index?page=1&hospitalId=${hospitalId}">首页</a>
            <a href="<%=request.getContextPath()%>/index?page=${page.pageIndex-1}&hospitalId=${hospitalId}">上一页 </a>
        </c:if>
        <c:if test="${not page.hasPrevious}">
            <span>首页</span>
            <span>上一页</span>
        </c:if>
        <c:if test="${page.hasNext}">
            <a href="<%=request.getContextPath()%>/index?page=${page.pageIndex+1}&hospitalId=${hospitalId}">下一页</a>
            <a href="<%=request.getContextPath()%>/index?page=${page.pageCount}&hospitalId=${hospitalId}">末页</a>
        </c:if>
        <c:if test="${not page.hasNext}">
            <span>下一页</span>
            <span>末页</span>
        </c:if>
        <span>第${page.pageIndex}页</span>
        <span>共${page.pageCount}页</span>
        <span>总数居记录:${page.totalCount}条</span>
    </div>
</form>
</body>
<script src="<%=request.getContextPath()%>/js/jQuery.js"></script>
<script>
    $(function () {
        $("#sta").click(function () {
            $.ajax({
                url: "update",
                data: {id:$(this).attr("bid")},
                type: "get",
                dataType: "JSON",
                success: function (data) {
                    alert("修改成功!");
                    history.go(0);

                }
            });

            $.ajax({
                url: "update2",
                data: {id:$(this).attr("bid")},
                type: "get",
                dataType: "JSON",
                success: function (data) {
                    history.go(0);

                }
            })
        })
    })
</script>
</html>
